<template>
  <el-dialog
    :title="title"
    width="1300px"
    :close-on-click-modal="false"
    :visible.sync="visible">

    <div style="display: flex;">
      <div style="width:900px;height:610px;">
          <el-input style="margin:0 10px;width:860px;" rows="27" resize="none" v-model="content" type="textarea" ></el-input>
          <!--div class="uploadfile" style="border:1px solid #ebeef5;padding:10px;">

          </div-->
          <div style="width:370px;text-align: right;margin-top: 10px;">
            <el-button type="primary" size="small" @click="versionUpdate()"><i class="el-icon-upload el-icon--left"></i>更新</el-button>
             <el-button type="primary" size="small" @click="toReloadNginxConfig()"><i class="el-icon-refresh el-icon--left"></i>重启</el-button>
          </div>
      </div>
    <div style="width:400px;height:610px;">
       <el-table
          :data="dataList"
          border
          v-loading="dataListLoading"
          row-key="id"
          style="width: 360px;height:578px;">
          <el-table-column
            prop="createTime"
            header-align="center"
            align="center"
            width="175"
            label="历史版本">
          </el-table-column>
          <el-table-column
          prop="status"
          header-align="center"
          width="90"
          align="center"
          label="状态">
              <template slot-scope="scope">
                <el-tag size="mini" type="danger" v-if="scope.row.status === 1"  effect="dark">使用中</el-tag>
                <el-tag size="mini" type="info" v-else  effect="dark">已失效</el-tag>
              </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            header-align="center"
            align="center"
            width="90"
            label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="showVersion(scope.$index)" >查看</el-button>
              <el-button type="text" size="small" @click="deleteVersion(scope.row.id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          @size-change="sizeChangeHandle"
          @current-change="currentChangeHandle"
          :current-page="pageIndex"
          :page-size="pageSize"
          :total="totalPage"
          layout="total,  prev, pager, next">
        </el-pagination>
    </div>

    </div>
  </el-dialog>
</template>
<script>
  export default {
    data () {
      return {
        visible: false,
        title:"",
        content:"",
        id:"",
        type:"",
        key:"",
        dataListLoading:false,
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataList:[],
        uploadForm:{
            name:'',
            versionName:'',
            fileUploadName:'',
            fileSaveName:'',
            fileSize:''
        },
        uploadRule:{},
        fileList:[]
      }
    },
    methods: {
      init (object) {
        this.visible = true
        this.title = object.name
        console.log(object)
        this.type=object.framework||object.moduleType
        this.id = object.id
        this.getDataList()
      },
      showVersion(index){
           this.content = this.dataList[index].content
      },
      deleteVersion(id){
          this.$confirm(`确定要删除[id=${id}]版本的配置文件吗?`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$http({
              url: this.$http.adornUrl('/serviceconfig/deleteVersion'),
              method: 'post',
              params: this.$http.adornParams({'id':id})
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.getDataList()
                  }
                })
              } else {
                this.$message.error(data.msg)
              }
            })
          })
      },
      toReloadNginxConfig(){
        this.$confirm(`确定重新载入配置吗?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http({
            url: this.$http.adornUrl('/publish/restartFront'),
            method: 'post',
             params: this.$http.adornParams({'id':id})
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500
              })
            } else {
              this.$message.error(data.msg)
            }
          })
        }).catch(() => {})
      },
      publishVersionToRuntime(id){
        this.$confirm(`确定将[id=${id}]发布到生产环境中吗?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http({
            url: this.$http.adornUrl('/publish/publishVersionToRuntime'),
            method: 'post',
            params: this.$http.adornParams({'id':id})
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.getDataList()
                }
              })
            } else {
              this.$message.error(data.msg)
            }
          })
        })
        // .catch(() => {})
      },
      versionUpdate(){
          this.$http({
           url: this.$http.adornUrl(`/serviceconfig/updateNewVersion`),
           method: 'post',
           data: this.$http.adornData({
                'type':1,
                'objectId':this.id,
                'content':this.content,
                'status': 1,
            })
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.uploadForm.name='',
              this.uploadForm.versionName='',
              this.uploadForm.fileUploadName='',
              this.uploadForm.fileSaveName='',
              this.uploadForm.fileSize='',
              this.fileList=[]
              this.getDataList()
            }
          })
      },
      getDataList(){
        this.$http({
          url: this.$http.adornUrl(`/serviceconfig/list`),
          method: 'get',
          params: this.$http.adornParams({
              'type':this.type,
              'objectId':this.id,
              'page': this.pageIndex,
              'limit': this.pageSize,
          })
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.dataList = data.page.list
            this.totalPage = data.page.totalCount
            if(this.dataList.length>0){
                this.content = this.dataList[0].content
            }
          } else {
            this.dataList = []
            this.totalPage = 0
          }
          this.dataListLoading = false
        })
      },
     // 每页数
     sizeChangeHandle (val) {
       this.pageSize = val
       this.pageIndex = 1
       this.getDataList()
     },
     // 当前页
     currentChangeHandle (val) {
       this.pageIndex = val
       this.getDataList()
     },
     // 多选
     selectionChangeHandle (val) {
       this.dataListSelections = val
     },
     // 新增 / 修改
     addOrUpdateHandle (id) {
       this.addOrUpdateVisible = true
       this.$nextTick(() => {
         this.$refs.addOrUpdate.init(id)
       })
     },
    }
  }
</script>
